<style>
   .box{
    font-size: 90px;
    color: green;

   }
</style>
<body>
    <div class="box" style="width: 100px;height: 200px; background-color: red;">你好啊</div>
    <script>
        //2 元素节点样式
       //    获取
       //    设置
       
       //    行类
       //    非行类
        var obox= document.querySelector('.box')
    //    行类
        console.log(obox.style);
        console.log(obox.style[0])
        console.log(obox.style.width)
        console.log(obox.style.height)
        console.log(obox.style.border)
        obox.style.width='200px'
        obox.style.border ='10px solid yellow'
        obox.style.background=''
        
    //    sonsole.log(obox.style.fontSize)
        

  //   非行类
     
  console.log(getComputedStyle(obox))
  console.log(getComputedStyle(obox).color)
  console.log(getComputedStyle(obox).fontSize)



  function getStyle(ele, attr){
    if(ele.currentStyle){
        return ele.currentStyle[attr];
    }else{
        return getComputedStyle(obox)[attr];
    }
}

     




    </script>
</body>